let stream = new MediaStream();
let suuid = $('#suuid').val();
let connected = false;
let reconnectInterval = null;
let reconnectAttempts = 0;
let maxReconnectAttempts = 10;
let statusCheckInterval = null;
let streamStatusElement = null;
let videoCheckInterval = null;
let hasVideoContent = false;
let lastVideoTimestamp = 0;
let streamStatusCheckTimer = null;
let lastSuccessfulConnection = 0; // 记录上次成功连接的时间戳
let isConnecting = false; // 连接锁，防止重复启动连接过程
let connectionAttemptTime = 0; // 上次尝试连接的时间

let config = {
  iceServers: [{
    urls: ["stun:stun.l.google.com:19302"]
  }]
};

// Create status overlay
function createStatusOverlay() {
  // Create status element if it doesn't exist
  if (!streamStatusElement) {
    streamStatusElement = document.createElement('div');
    streamStatusElement.id = 'stream-status';
    streamStatusElement.style.position = 'absolute';
    streamStatusElement.style.top = '10px';
    streamStatusElement.style.left = '10px';
    streamStatusElement.style.padding = '5px 10px';
    streamStatusElement.style.borderRadius = '4px';
    streamStatusElement.style.fontWeight = 'bold';
    streamStatusElement.style.zIndex = '1000';
    document.getElementById('remoteVideos').appendChild(streamStatusElement);
  }
}

// Update stream status display
function updateStreamStatus(status, message) {
  if (!streamStatusElement) {
    createStatusOverlay();
  }
  
  switch(status) {
    case 'connecting':
      streamStatusElement.textContent = '连接中...';
      streamStatusElement.style.backgroundColor = '#FFA500';
      streamStatusElement.style.color = 'white';
      break;
    case 'connected':
      streamStatusElement.textContent = '已连接';
      streamStatusElement.style.display = 'none';
      streamStatusElement.style.backgroundColor = '#4CAF50';
      streamStatusElement.style.color = 'white';
      // Hide after 3 seconds when connected
      setTimeout(() => {
        streamStatusElement.style.opacity = '0.3';
      }, 3000);
      break;
    case 'disconnected':
      streamStatusElement.textContent = '连接断开 - 尝试重连中...';
      streamStatusElement.style.backgroundColor = '#F44336';
      streamStatusElement.style.color = 'white';
      streamStatusElement.style.opacity = '1';
      break;
    case 'error':
      streamStatusElement.textContent = message || '发生错误';
      streamStatusElement.style.backgroundColor = '#F44336';
      streamStatusElement.style.color = 'white';
      streamStatusElement.style.opacity = '1';
      break;
  }
}

// Show or hide the no video overlay
function showNoVideoOverlay(show, status) {
  const overlay = document.getElementById('no-video-overlay');
  if (overlay) {
    overlay.style.display = show ? 'flex' : 'none';
    
    // 使用新的状态更新功能（如果可用）
    if (show && window.updateOverlayStatus && status) {
      window.updateOverlayStatus(status);
    }
  }
}

// Function to check if video has content
function startVideoContentCheck() {
  const videoElem = document.getElementById('videoElem');
  
  // Clear any existing interval
  if (videoCheckInterval) {
    clearInterval(videoCheckInterval);
  }
  
  // Initial check for video content
  checkVideoContent();
  
  // Set up video content detection
  videoCheckInterval = setInterval(checkVideoContent, 1000);
  
  // 每30秒主动检查流状态，确保长期连接稳定性
  setTimeout(() => {
    if (!hasVideoContent && Date.now() - lastSuccessfulConnection > 10000) {
      log('30秒无视频内容，主动检查流状态');
      checkStreamStatus();
    }
  }, 30000);
}

// 单独的视频内容检查函数
function checkVideoContent() {
  const videoElem = document.getElementById('videoElem');
  
  if (!connected) {
    showNoVideoOverlay(true, 'reconnecting');
    return;
  }
  
  // 检查视频元素是否准备好
  if (!videoElem || !videoElem.readyState) {
    hasVideoContent = false;
    showNoVideoOverlay(true, 'connecting');
    return;
  }
  
  // 检测视频是否冻结
  if (lastVideoTimestamp === videoElem.currentTime && videoElem.currentTime > 0) {
    // 如果超过2秒没有变化，认为视频冻结
    if (Date.now() - lastTimeUpdate > 2000) {
      log('视频已冻结，重新连接...');
      hasVideoContent = false;
      showNoVideoOverlay(true, 'reconnecting');
      // 强制重连
      if (connected) {
        connected = false;
        startReconnect();
      }
      return;
    }
  } else {
    // 更新时间戳
    lastVideoTimestamp = videoElem.currentTime;
    lastTimeUpdate = Date.now();
  }
  
  // 检查是否是黑屏
  try {
    const canvas = document.createElement('canvas');
    const width = videoElem.videoWidth;
    const height = videoElem.videoHeight;
    
    // 如果视频尺寸为0，则没有视频
    if (width === 0 || height === 0) {
      hasVideoContent = false;
      showNoVideoOverlay(true, 'reconnecting');
      return;
    }
    
    canvas.width = width;
    canvas.height = height;
    const ctx = canvas.getContext('2d');
    ctx.drawImage(videoElem, 0, 0, width, height);
    
    // 从视频的几个关键位置获取像素数据
    const positions = [
      {x: Math.floor(width / 2), y: Math.floor(height / 2)}, // 中心
      {x: Math.floor(width / 4), y: Math.floor(height / 4)}, // 左上
      {x: Math.floor(width * 3/4), y: Math.floor(height / 4)}, // 右上
      {x: Math.floor(width / 4), y: Math.floor(height * 3/4)}, // 左下
      {x: Math.floor(width * 3/4), y: Math.floor(height * 3/4)} // 右下
    ];
    
    // 检查所有采样点是否都是黑色
    let allBlack = true;
    let totalBrightness = 0;
    
    for (const pos of positions) {
      const pixelData = ctx.getImageData(pos.x, pos.y, 1, 1).data;
      // 检查 RGB 值（忽略 alpha）
      const brightness = pixelData[0] + pixelData[1] + pixelData[2];
      totalBrightness += brightness;
      if (brightness > 30) { // 更宽松的黑色阈值
        allBlack = false;
      }
    }
    
    // 检查平均亮度是否非常低（接近黑色但不完全是黑色）
    const avgBrightness = totalBrightness / (positions.length * 3); // 每个点3个通道
    const isVeryDark = avgBrightness < 10;
    
    // 连续黑帧计数
    if (allBlack || isVeryDark) {
      if (!window.blackFrameCount) window.blackFrameCount = 0;
      window.blackFrameCount++;
      
      // 如果连续30个黑帧（约5秒），考虑强制重连
      if (window.blackFrameCount > 30) {
        log('检测到连续30个黑帧，强制重新连接');
        window.blackFrameCount = 0;
        hasVideoContent = false;
        forceRefreshStream();
        return;
      }
    } else {
      window.blackFrameCount = 0;
    }
    
    // 检查视频是否正在播放
    const isPlaying = !videoElem.paused && !videoElem.ended && videoElem.readyState > 2;
    
    // 更新视频内容状态
    const previousHasContent = hasVideoContent;
    hasVideoContent = !allBlack && !isVeryDark && isPlaying;
    
    // 如果状态发生变化，打印日志
    if (previousHasContent !== hasVideoContent) {
      if (hasVideoContent) {
        log('检测到视频内容恢复');
      } else {
        log('检测到视频内容丢失');
        
        // 只有在连接状态下，才考虑重新连接
        if (connected) {
          setTimeout(() => {
            checkStreamStatus();
          }, 1000);
        }
      }
    }
    
    showNoVideoOverlay(!hasVideoContent, hasVideoContent ? null : 'reconnecting');
    
  } catch (e) {
    console.error('检查视频内容时出错:', e);
    // 出错时假设没有视频
    hasVideoContent = false;
    showNoVideoOverlay(true, 'error');
  }
}


const baseurl = "http://"+window.location.hostname+":10087";
// 获取API基础URL
const getApiUrl = () => {
  return baseurl+'/api';
};


// Starting streaming

function forceRefreshStream() {
  log('强制刷新流...');
  // 断开现有连接
  if (window.pc && window.pc.connectionState !== 'closed') {
    window.pc.close();
  }
  connected = false;
  
  // 清理状态
  clearInterval(reconnectInterval);
  clearInterval(videoCheckInterval);
  reconnectAttempts = 0;
  
  // 完全释放资源
  releaseResources();
  
  // 检查流状态
  $.ajax({
    url: getApiUrl() + "/streams/" + suuid + "/connection-status",
    type: "GET",
    timeout: 3000,
    success: function(data) {
      if (data && data.connected) {
        log('流状态正常，重新建立WebRTC连接');
        startConnectionProcess();
      } else {
        log('流状态异常，尝试重启流');
        startStream();
      }
    },
    error: function() {
      log('无法检查流状态，尝试重启流');
      startStream();
    }
  });
}

// 尝试主动启动流
function startStream() {
  updateStreamStatus('connecting', '正在启动流...');
  
  $.ajax({
    url: getApiUrl() + "/streams/" + suuid + "/start",
    type: "POST",
    timeout: 5000,
    success: function(response) {
      log('启动流成功，response:', response);
      
      // 启动后等待1秒再检查连接状态，给服务器一些时间建立连接
      setTimeout(function() {
        $.get(getApiUrl() + "/streams/" + suuid + "/connection-status", function(data) {
          if (data && data.connected) {
            log('流已成功启动并连接');
            if (!connected) {
              connectToStream(); // 如果客户端未连接，则连接到流
            }
          } else {
            log('流启动后未连接，可能存在问题');
            updateStreamStatus('error', '启动流失败，请重试');
            showNoVideoOverlay(true, 'start_failed');
          }
        }).fail(function() {
          log('检查流连接状态失败');
          updateStreamStatus('error', '检查流连接状态失败');
        });
      }, 1000);
    },
    error: function(xhr, status, error) {
      log('启动流失败: ' + status + ' - ' + (error || '未知错误'));
      if (xhr && xhr.responseText) {
        log('错误详情: ' + xhr.responseText);
      }
      updateStreamStatus('error', '启动流失败');
      showNoVideoOverlay(true, 'start_failed');
    }
  });
}

// 设置强制刷新按钮
function setupForceRefreshButton() {
  // 检查是否已经存在刷新按钮
  if ($('#force-refresh-btn').length === 0) {
    // 创建刷新按钮
    const refreshBtn = $('<button>')
      .attr('id', 'force-refresh-btn')
      .text('强制刷新')
      .css({
        'position': 'absolute',
        'top': '10px',
        'right': '10px',
        'z-index': '1001',
        'padding': '5px 10px',
        'background-color': '#2196F3',
        'color': 'white',
        'border': 'none',
        'border-radius': '4px',
        'cursor': 'pointer'
      })
      .click(function() {
        forceRefreshStream();
      });
    
    // 添加到视频容器
    $('#remoteVideos').append(refreshBtn);
  }
}

// 视频元素出错处理
function setupVideoErrorHandling() {
  const videoElem = document.getElementById('videoElem');
  if (!videoElem) {
    log('⚠️ 找不到视频元素，无法设置错误处理');
    return;
  }
  
  // 确保视频元素处于正确的状态
  videoElem.autoplay = true;
  videoElem.playsInline = true;
  videoElem.muted = true; // 静音播放，避免自动播放策略限制
  
  // 添加全面的错误处理
  videoElem.onerror = function(e) {
    const errorMessage = e.target.error ? e.target.error.message : '未知错误';
    log('视频元素错误: ' + errorMessage);
    showNoVideoOverlay(true, 'error');
    
    // 视频错误时，尝试重新建立连接
    // 先释放连接锁
    isConnecting = false;
    
    setTimeout(() => {
      safeStartConnectionProcess();
    }, 3000);
  };
  
  // 监听视频状态变化
  videoElem.addEventListener('stalled', () => {
    log('视频卡住了');
    setTimeout(() => {
      if (!isConnecting) {
        checkStreamStatus();
      }
    }, 500);
  });
  
  videoElem.addEventListener('waiting', () => {
    log('视频等待中...');
    // 短暂显示加载状态
    showNoVideoOverlay(true, 'connecting');
  });
  
  videoElem.addEventListener('playing', () => {
    log('✅ 视频开始播放');
    hasVideoContent = true;
    showNoVideoOverlay(false);
    updateStreamStatus('connected');
    isConnecting = false; // 视频播放时释放连接锁
  });
  
  // 添加额外监听
  videoElem.addEventListener('canplay', () => {
    log('视频可以播放');
    if (videoElem.paused) {
      videoElem.play().catch(e => log('canplay事件后播放失败: ' + e.message));
    }
  });
}

// Check stream status periodically
function startStatusCheck() {
  clearInterval(statusCheckInterval);
  statusCheckInterval = setInterval(() => {
    $.get(getApiUrl() + "/streams/" + suuid + "/connection-status", function(data) {
      if (!data || !data.connected) {
        if (connected) {
          connected = false;
          updateStreamStatus('disconnected');
          showNoVideoOverlay(true, 'error');
          startReconnect();
        }
      } else if (data.connected && !connected) {
        // Stream is available but we're not connected
        connectToStream();
      }
    }).fail(function(xhr, status, error) {
      log('检查流状态失败: ' + status + ' - ' + (error || '未知错误'));
      if (xhr && xhr.status) {
        log('HTTP状态码: ' + xhr.status);
      }
    });
  }, 5000);
}

let lastTimeUpdate = Date.now();
let log = msg => {
  const time = new Date().toLocaleTimeString();
  document.getElementById('div').innerHTML = time + ': ' + msg + '<br>' + document.getElementById('div').innerHTML;
  // 限制日志长度
  if (document.getElementById('div').innerHTML.length > 5000) {
    document.getElementById('div').innerHTML = document.getElementById('div').innerHTML.substring(0, 5000);
  }
}

// 获取并显示流的详细信息
function getStreamDetails() {
  log('获取流详细信息: ' + suuid);
  
  $.ajax({
    url: getApiUrl() + "/streams/" + suuid,
    type: "GET",
    timeout: 3000,
    dataType: "json",
    success: function(data) {
      let details = "流信息:\n";
      
      if (!data) {
        details += "- 流不存在";
      } else {
        details += "- ID: " + suuid + "\n";
        details += "- Status: " + (data.Status ? "运行中" : "未运行") + "\n";
        details += "- URL: " + (data.URL || data.url || "未设置") + "\n";
        details += "- OnDemand: " + (data.OnDemand ? "是" : "否") + "\n";
        details += "- DisableAudio: " + (data.DisableAudio ? "是" : "否") + "\n";
        details += "- Debug: " + (data.Debug ? "是" : "否") + "\n";
      }
      
      log(details);
    },
    error: function(xhr, status, error) {
      log('获取流详情失败: ' + status + ' - ' + (error || '未知错误'));
    }
  });
}

$(document).ready(function() {
  $('#' + suuid).addClass('active');
  
  // Create status overlay
  createStatusOverlay();
  
  // 显示初始连接状态
  showNoVideoOverlay(true, 'connecting');
  
  // 获取流详细信息
  getStreamDetails();
  
  // 设置视频错误处理
  setupVideoErrorHandling();
  
  // 设置刷新按钮
  setupForceRefreshButton();
  
  // 先检查流状态，再决定是否开始连接
  log('初始化 - 先检查流状态');
  $.ajax({
    url: getApiUrl() + "/streams/" + suuid + "/connection-status",
    type: "GET",
    timeout: 1000,
    success: function(data) {
      log('初始流状态: ' + JSON.stringify(data));
      if (data && data.connected) {
        log('流已连接，开始建立WebRTC连接');
        safeStartConnectionProcess();
      } else {
        log('流未连接，先尝试启动流');
        startStream();
      }
    },
    error: function() {
      log('检查流状态失败，尝试启动流');
      startStream();
    }
  });
});

function getCodecInfo() {
  log('获取编解码器信息...');
  
  $.get("../codec/" + suuid, function(data) {
    try {
      // 尝试解析数据
      if (typeof data === 'string') {
        data = JSON.parse(data);
      }
      
      // 检查是否有编解码器数据
      if (Array.isArray(data) && data.length > 0) {
        log('收到编解码器信息: ' + JSON.stringify(data));
        
        // 确保WebRTC连接存在
        if (!window.pc) {
          window.pc = initPeerConnection();
        }
        
        // 为每种媒体类型添加收发器
        data.forEach(codec => {
          if (codec.Type) {
            try {
              window.pc.addTransceiver(codec.Type, {
                'direction': 'sendrecv'
              });
              log('添加了' + codec.Type + '类型的收发器');
            } catch(e) {
              log('添加收发器失败: ' + e.message);
            }
          }
        });
        
        // 在一个微任务中触发协商过程，确保所有收发器都已添加
        setTimeout(() => {
          if (window.pc && window.pc.onnegotiationneeded) {
            log('手动触发协商过程');
            window.pc.onnegotiationneeded();
          }
        }, 100);
      } else {
        log('未收到有效的编解码器信息，重新检查流状态');
        isConnecting = false; // 释放连接锁
        setTimeout(() => {
          safeCheckAndStartStream();
        }, 3000);
      }
    } catch (e) {
      log('解析编解码器信息失败: ' + e.message);
      isConnecting = false; // 释放连接锁
      setTimeout(() => {
        safeCheckAndStartStream();
      }, 3000);
    }
  }).fail(function(xhr, status, error) {
    log('获取编解码器信息失败: ' + (error || status));
    isConnecting = false; // 释放连接锁
    
    // 检查流是否可用，不可用则尝试启动
    setTimeout(() => {
      safeCheckAndStartStream();
    }, 3000);
  });
}

let sendChannel = null;

function getRemoteSdp() {
  log('请求远程SDP...');
  
  // 发送本地SDP到服务器，获取远程SDP
  $.post("../receiver/"+ suuid, {
    suuid: suuid,
    data: btoa(window.pc.localDescription.sdp)
  }, function(data) {
    try {
      // 设置远程描述
      let remoteSdp = atob(data);
      log('接收到远程SDP，长度: ' + remoteSdp.length);
      
      window.pc.setRemoteDescription(new RTCSessionDescription({
        type: 'answer',
        sdp: remoteSdp
      })).then(() => {
        log('远程描述设置成功');
        
        // 成功设置远程描述后，标记为连接成功
        setTimeout(() => {
          // 如果5秒后仍未收到媒体轨道，检查连接状态
          if (!hasVideoContent && connected) {
            log('设置远程描述后没有收到媒体轨道，检查连接');
            checkStreamStatus();
          }
        }, 5000);
        
      }).catch(e => {
        log('设置远程描述失败: ' + e.message);
        // 如果设置远程描述失败，尝试重新开始
        setTimeout(() => {
          handleSdpFailure(e);
        }, 2000);
      });
    } catch (e) {
      log('处理远程SDP失败: ' + e.message);
      
      // 如果设置远程描述失败，尝试重新开始整个流程
      setTimeout(() => {
        handleSdpFailure(e);
      }, 2000);
    }
  }).fail(function(xhr, status, error) {
    log('获取远程SDP失败: ' + (error || status));
    
    // 释放连接锁以允许重试
    isConnecting = false;
    
    // 检查流状态
    setTimeout(checkAndStartStream, 2000);
  });
}

/**
 * 处理SDP协商失败
 */
function handleSdpFailure(error) {
  log('处理SDP协商失败: ' + (error ? error.message : '未知错误'));
  
  // 释放连接锁
  isConnecting = false;
  
  // 如果连接已成功但没有视频内容，则尝试重新连接
  if (connected && !hasVideoContent) {
    log('连接已成功但无视频内容，强制重连');
    connected = false;
    startConnectionProcess();
    return;
  }
  
  // 检查流状态，决定是重启流还是重新连接
  $.ajax({
    url: getApiUrl() + "/streams/" + suuid + "/connection-status",
    type: "GET",
    timeout: 3000,
    dataType: "json",
    success: function(data) {
      if (data && data.connected) {
        log('流仍然可用，尝试重新建立WebRTC连接');
        safeStartConnectionProcess();
      } else {
        log('流不可用，尝试重启流');
        startStream();
      }
    },
    error: function() {
      log('无法获取流状态，尝试重启流');
      startStream();
    }
  });
}

/**
 * 检查流状态
 */
function checkStreamStatus() {
  // 如果当前正在连接中，跳过检查
  if (isConnecting) {
    log('正在连接中，跳过状态检查');
    return;
  }
  
  // 如果距离上次连接尝试不足3秒，跳过
  if (Date.now() - connectionAttemptTime < 3000) {
    log('距离上次连接尝试时间过短，跳过');
    return;
  }
  
  $.ajax({
    url: getApiUrl() + "/streams/" + suuid + "/connection-status",
    type: "GET",
    timeout: 3000,
    dataType: "json",
    success: function(data) {
      const streamConnected = data && data.connected;
      log('流连接状态: ' + (streamConnected ? '已连接' : '未连接') + 
          ', 前端连接状态: ' + (connected ? '已连接' : '未连接') +
          ', 视频内容: ' + (hasVideoContent ? '有' : '无'));
      
      if (!streamConnected && connected) {
        // 流断开但前端仍然连接状态 - 需要重新连接
        log('流已断开但前端仍显示为连接状态，强制重连');
        connected = false;
        showNoVideoOverlay(true, 'error');
        
        // 启动新的连接流程
        safeStartConnectionProcess();
      } 
      else if (streamConnected && !connected) {
        // 流已连接但前端未连接 - 需要连接
        log('流已连接但前端未连接，启动连接过程');
        safeStartConnectionProcess();
      }
      else if (streamConnected && connected && !hasVideoContent) {
        // 流已连接前端也已连接，但没有视频内容 - 可能需要重新连接
        log('流和前端都已连接但没有视频内容，尝试重新建立连接');
        
        // 如果最后一次成功连接是超过10秒前，才尝试重连
        if (Date.now() - lastSuccessfulConnection > 10000) {
          // 如果上次连接尝试是在20秒内，而且已经尝试重连5次以上，则尝试重启流
          if (reconnectAttempts > 5 && Date.now() - lastSuccessfulConnection < 20000) {
            log('多次重连失败，尝试重启流');
            startStream();
          } else {
            safeStartConnectionProcess();
            reconnectAttempts++;
          }
        }
      }
    },
    error: function(xhr, status, error) {
      log('检查流状态失败: ' + (error || status));
      
      // 如果流状态检查失败且前端显示已连接但无视频，尝试重新连接
      if (connected && !hasVideoContent) {
        log('流状态检查失败，前端无视频，尝试重连');
        safeStartConnectionProcess();
      }
    }
  });
}

/**
 * 安全启动连接过程，防止重复调用
 */
function safeStartConnectionProcess() {
  // 如果正在连接中，不要重复启动
  if (isConnecting) {
    log('已有连接过程在进行中，跳过');
    return;
  }
  
  // 如果距离上次连接尝试不足3秒，跳过
  if (Date.now() - connectionAttemptTime < 3000) {
    log('距离上次连接尝试时间过短，跳过');
    return;
  }
  
  // 记录连接尝试时间
  connectionAttemptTime = Date.now();
  
  // 设置连接锁
  isConnecting = true;
  
  // 启动连接过程
  log('安全启动连接过程');
  startConnectionProcess();
}

/**
 * 启动连接过程 - 核心函数
 */
function startConnectionProcess() {
  log('启动全新的连接流程...');
  
  // 1. 完全释放之前的资源
  releaseResources();
  
  // 2. 更新UI状态
  updateStreamStatus('connecting');
  showNoVideoOverlay(true, 'connecting');
  
  // 3. 确保断开任何正在进行的连接
  if (window.pc) {
    try {
      window.pc.close();
    } catch (e) {
      console.error('关闭WebRTC连接失败:', e);
    }
    window.pc = null;
  }
  
  // 等待短暂延迟确保资源释放
  setTimeout(() => {
    // 4. 初始化新的连接
    window.pc = initPeerConnection();
    
    // 5. 获取编解码器信息并建立连接
    getCodecInfo();
    
    // 6. 设置周期性检查
    startStatusChecks();
    
    // 7. 延迟释放连接锁 - 给足够的时间尝试建立连接
    setTimeout(() => {
      isConnecting = false;
      log('连接锁已释放');
    }, 7000);
  }, 500);
}

/**
 * 启动所有状态检查定时器
 */
function startStatusChecks() {
  log('启动所有状态检查定时器');
  
  // 启动视频内容检查
  startVideoContentCheck();
  
  // 启动流状态检查
  startStreamStatusCheck();
  
  // 启动定期状态检查
  startStatusCheck();
}

/**
 * 初始化新的WebRTC连接
 */
function initPeerConnection() {
  log('初始化新的WebRTC连接...');
  
  // 显示连接中状态
  updateStreamStatus('connecting');
  showNoVideoOverlay(true, 'connecting');
  
  // 创建新的对等连接
  window.pc = new RTCPeerConnection(config);
  
  // 协商需要时的事件处理
  window.pc.onnegotiationneeded = async function() {
    // 如果不在连接中状态，跳过
    if (!isConnecting) {
      log('非连接中状态，跳过媒体协商');
      return;
    }
    
    log('需要媒体协商...');
    updateStreamStatus('connecting');
    showNoVideoOverlay(true, 'connecting');
    
    try {
      log('创建连接要约...');
      let offer = await window.pc.createOffer({
        offerToReceiveAudio: true,
        offerToReceiveVideo: true
      });
      
      log('设置本地描述...');
      try {
        await window.pc.setLocalDescription(offer);
        log('本地描述设置成功，获取远程SDP...');
        getRemoteSdp();
      } catch (sdpErr) {
        log('设置本地描述失败: ' + sdpErr.message);
        
        // 如果是SDP m-lines顺序问题，尝试重新创建连接
        if (sdpErr.message && sdpErr.message.includes("m-lines")) {
          log('检测到SDP m-line顺序问题，重新初始化连接');
          
          // 完全关闭当前连接
          if (window.pc) {
            try {
              window.pc.close();
            } catch (e) {
              console.error('关闭WebRTC连接失败:', e);
            }
            window.pc = null;
          }
          
          // 延迟后尝试全新建立连接流程
          setTimeout(() => {
            startConnectionProcess();
          }, 1000);
        } else {
          // 其他错误，尝试重新连接
          setTimeout(() => {
            if (!connected) {
              safeStartConnectionProcess();
            }
          }, 5000);
        }
        
        // 释放连接锁
        isConnecting = false;
      }
    } catch (err) {
      console.error('创建offer失败:', err);
      log('创建连接要约失败: ' + err.message);
      updateStreamStatus('error', '创建连接请求失败');
      showNoVideoOverlay(true, 'error');
      
      // 释放连接锁
      isConnecting = false;
      
      // 延迟后尝试重连
      setTimeout(() => {
        if (!connected) {
          safeStartConnectionProcess();
        }
      }, 5000);
    }
  };
  
  // 处理接收到的媒体轨道
  window.pc.ontrack = function(event) {
    log('接收到媒体轨道: ' + event.track.kind);
    
    // 添加到流中
    stream.addTrack(event.track);
    
    // 更新视频元素
    const videoElem = document.getElementById('videoElem');
    if (videoElem) {
      // 确保视频元素已经准备好
      if (videoElem.srcObject !== stream) {
        videoElem.srcObject = stream;
        log('已设置新的视频源');
      }
      
      // 确保视频播放
      if (videoElem.paused) {
        const playPromise = videoElem.play();
        if (playPromise !== undefined) {
          playPromise.then(() => {
            log('视频播放成功启动');
          }).catch(error => {
            log('视频自动播放失败: ' + error.message);
            // 尝试静音播放
            videoElem.muted = true;
            videoElem.play().catch(e => log('即使静音也无法播放: ' + e.message));
          });
        }
      }
      
      // 监听视频事件
      videoElem.onloadedmetadata = function() {
        log('视频元数据已加载，分辨率: ' + videoElem.videoWidth + 'x' + videoElem.videoHeight);
      };
      
      videoElem.onplaying = function() {
        log('✅ 视频开始播放');
        hasVideoContent = true;
        isConnecting = false; // 视频开始播放后释放连接锁
        showNoVideoOverlay(false);
        updateStreamStatus('connected');
        
        // 记录成功连接时间
        lastSuccessfulConnection = Date.now();
      };
      
      videoElem.onstalled = function() {
        log('视频播放停滞');
      };
      
      videoElem.onwaiting = function() {
        log('视频等待数据...');
      };
      
      videoElem.onerror = function(e) {
        log('视频播放错误: ' + (e.message || '未知错误'));
        isConnecting = false; // 出错时释放连接锁
      };
    } else {
      log('⚠️ 找不到视频元素!');
      isConnecting = false; // 找不到视频元素时释放连接锁
    }
  };
  
  // ICE连接状态变化处理
  window.pc.oniceconnectionstatechange = function() {
    log('ICE连接状态: ' + window.pc.iceConnectionState);
    
    if (window.pc.iceConnectionState === 'connected' || 
        window.pc.iceConnectionState === 'completed') {
      
      // 连接成功
      connected = true;
      reconnectAttempts = 0;
      lastSuccessfulConnection = Date.now();
      isConnecting = false; // 连接成功后释放连接锁
      
      // 更新UI
      updateStreamStatus('connected');
      updatePlayStatus(true);
      
      // 取消任何进行中的重连
      clearInterval(reconnectInterval);
      reconnectInterval = null;
      
      // 确保视频播放
      const videoElem = document.getElementById('videoElem');
      if (videoElem && videoElem.paused) {
        videoElem.play().catch(e => log('连接后播放失败: ' + e.message));
      }
      
    } else if (window.pc.iceConnectionState === 'disconnected' || 
              window.pc.iceConnectionState === 'failed' ||
              window.pc.iceConnectionState === 'closed') {
      
      // 连接断开或失败
      if (connected) {
        log('WebRTC连接已断开');
        connected = false;
        updateStreamStatus('disconnected');
        showNoVideoOverlay(true, 'reconnecting');
        updatePlayStatus(false);
        
        // 仅在连接锁未激活时才启动重连
        if (!isConnecting) {
          // 延迟启动重连 - 避免立即重连
          setTimeout(() => {
            safeStartConnectionProcess();
          }, 3000);
        }
      }
      
      // 无论如何释放连接锁
      isConnecting = false;
    }
  };
  
  return window.pc;
}

// Function to update play status on server
function updatePlayStatus(isPlaying) {
  // Generate a client ID if not exists
  if (!localStorage.getItem('rtsp_client_id')) {
    localStorage.setItem('rtsp_client_id', generateUUID());
  }
  
  let clientId = localStorage.getItem('rtsp_client_id');
  
  $.post(getApiUrl() + "/streams/"+ suuid + "/play-status", {
    client_id: clientId,
    is_playing: isPlaying
  }).fail(function(xhr, status, error) {
    log('更新播放状态失败: ' + status + ' - ' + (error || '未知错误'));
  });
}

// Generate a UUID for client identification
function generateUUID() {
  return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function(c) {
    var r = Math.random() * 16 | 0, v = c == 'x' ? r : (r & 0x3 | 0x8);
    return v.toString(16);
  });
}

/**
 * 安全检查流状态并尝试启动
 */
function safeCheckAndStartStream() {
  // 如果正在连接中，不要重复检查
  if (isConnecting) {
    log('已有连接过程在进行中，跳过流状态检查');
    return;
  }
  
  // 如果距离上次连接尝试不足3秒，跳过
  if (Date.now() - connectionAttemptTime < 3000) {
    log('距离上次连接尝试时间过短，跳过');
    return;
  }
  
  checkAndStartStream();
}

/**
 * 检查流状态并在必要时尝试启动
 */
function checkAndStartStream() {
  log('检查流状态...');
  
  $.ajax({
    url: getApiUrl() + "/streams/" + suuid + "/connection-status",
    type: "GET",
    timeout: 3000,
    dataType: "json",
    success: function(data) {
      log('流状态信息: ' + JSON.stringify(data));
      
      if (!data || !data.connected) {
        // 流不存在或未连接，尝试启动
        log('流未连接，尝试启动...');
        startStream();
      } else if (data.connected) {
        // 流已连接，无论前端是否已连接都重新建立连接
        log('流已连接 - 强制重新建立连接');
        connected = false; // 重置连接状态
        safeStartConnectionProcess();
      }
    },
    error: function(xhr, status, error) {
      log('检查流状态失败: ' + (error || status));
      
      // 错误情况下尝试启动流
      startStream();
    }
  });
}

// 开始定期检查流状态
function startStreamStatusCheck() {
  // 清除任何现有的检查
  if (streamStatusCheckTimer) {
    clearInterval(streamStatusCheckTimer);
  }
  
  // 立即执行一次检查
  checkStreamStatus();
  
  // 设置定期检查 - 更频繁地检查流状态，确保及时发现流恢复
  streamStatusCheckTimer = setInterval(checkStreamStatus, 2000); // 每2秒检查一次
}

/**
 * 完全重置并释放WebRTC连接和媒体资源
 */
function releaseResources() {
  log('释放所有媒体资源...');
  
  // 停止所有状态检查定时器
  clearInterval(reconnectInterval);
  reconnectInterval = null;
  clearInterval(videoCheckInterval);
  videoCheckInterval = null;
  clearInterval(statusCheckInterval);
  statusCheckInterval = null;
  clearInterval(streamStatusCheckTimer);
  streamStatusCheckTimer = null;
  
  // 关闭WebRTC连接
  if (window.pc) {
    try {
      if (window.pc.connectionState !== 'closed') {
        window.pc.close();
      }
      window.pc = null;
    } catch (e) {
      console.error('关闭RTCPeerConnection失败:', e);
    }
  }
  
  // 停止并清理媒体轨道
  if (stream) {
    try {
      stream.getTracks().forEach(track => {
        track.stop();
      });
    } catch (e) {
      console.error('停止媒体轨道失败:', e);
    }
  }
  
  // 创建新的媒体流
  stream = new MediaStream();
  
  // 彻底重置视频元素
  const videoElem = document.getElementById('videoElem');
  if (videoElem) {
    videoElem.srcObject = null;
    videoElem.pause();
    
    try {
      // 移除所有事件监听器
      videoElem.onplaying = null;
      videoElem.onpause = null;
      videoElem.onended = null;
      videoElem.onerror = null;
      videoElem.onloadedmetadata = null;
      videoElem.onstalled = null;
      videoElem.onwaiting = null;
      
      // 强制重新加载视频元素
      videoElem.load();
      
      // 创建新的视频元素替换旧的元素
      const newVideo = document.createElement('video');
      newVideo.id = 'videoElem';
      newVideo.autoplay = true;
      newVideo.controls = false;
      newVideo.playsInline = true;
      newVideo.muted = true;
      newVideo.style = videoElem.style;
      newVideo.className = videoElem.className;
      
      // 替换旧的视频元素
      if (videoElem.parentNode) {
        videoElem.parentNode.replaceChild(newVideo, videoElem);
        log('已替换视频元素');
        
        // 重新设置视频错误处理
        setupVideoErrorHandling();
      }
    } catch (e) {
      console.error('重置视频元素失败:', e);
    }
  }
  
  // 重置连接状态
  connected = false;
  reconnectAttempts = 0;
  hasVideoContent = false;
}
